<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>关于</title>
		<style>
			.arrow{
				width:32px ;
				height: 32px;
				background-image: url(img/arrow.png);
				position: fixed;
				top: 90%;
				right: 20px;
				z-index: 11;
			}
			body{
				background-image:url(img/关于（2）/22.jpg) ;
				background-repeat: no-repeat;
				background-repeat:round;
				background-attachment:fixed ;
			}
			*{
				margin: 0px;
				padding: 0px;
				list-style-type: none;
				text-decoration: none;
				color: #000000;
			}
			.heard{
				width: 100%;
				height: 200px;
			}
			.heard-top{
				width: 100%;
				height: 50px;
				background-color: #000000;
			}
			.heard-top div{
				width: 1200px;
				height: 50px;
				margin: auto;
				/*border: 1px solid white;*/
			}
			.heard-top div img{
				width: 200px;
				height: 50px;
				float: left;
			}
			.heard-top div ul li a{
				width: 100px;
				height: 50px;
				float: right;
				color: #FFFFFF;
				line-height: 50px;
				text-align: center;
			}
			.heard-top div ul li:hover a{
				color: #FE9126;
				transition: all 1s;
			}
			/*顶部黑色导航栏*/
			.heard-cen{
				width: 100%;
				height: 100px;
				background-color: white;
			}
			.heard-cen div{
				width: 1200px;
				height:100px;
				/*border: 1px solid;*/
				position: relative;
				margin: auto;
			}
			.heard-cen div h1{
				margin: auto;
				width: 500px;
				height: 100px;
				font-size: 50px;
				line-height: 100px;
				color: #FE9126;
			}
			.heard-cen div input{
				width: 250px;
				height: 40px;
				font-size: 30px;
				position:absolute;
				top: 30px;
				right: 70px;
			}
			.heard-cen div span{
				width: 40px;
				height: 40px;
				float: right;
				position: absolute;
				top: 30px;
				right:20px;
				border: 1px solid;
				background-position-x: -12px;
				background-position-y: 53px;
				background-image:url(img/sousuo.png) ;
			}
			.heard-cen div span:hover{
				background-image: url(img/sss.png);
			}
			/*中间白色导航带搜索框*/
			.heard-bot{
				width: 100%;
				height: 50px;
				background-color: #FE9126;
			}
			.h-b-d{
				width: 1200px;
				height:50px;
				margin: auto;
				/*border: 1px solid;*/
				position: relative;
			}
			.index{
				width: 200px;
				height: 50px;
				float: left;
				line-height: 50px;
				text-align: center;
				/*border: 1px solid;*/
			}
			.one{
				width:200px;
				height: 50px;
				line-height: 50px;
				text-align: center;
				float: left;
				cursor: pointer;
				/*border: 1px solid;*/
			}
			.two{
				display: none;
				width: 200px;
				height: 250px;
				background-color: white;
				z-index: 4;
				position: relative;
				box-shadow: 0px 0px 5px;
				/*border: 1px solid;*/
			}
			.two ol li a{
				width: 200px;
				height: 60px;
				line-height: 60px;
				text-align: center;
				display: block;
				color: #999999;
			}
			.two ol li:hover a{
				color: #FE9126;
				box-shadow: 0px 0px 5px;
			}
			.one:hover .two{
				display: block;
			}
			/*导航栏结束可以复制*/
			.bottom{
				width: 100%;
				height: 300px;
				text-align: center;
				background-color: #2B2A2A;
			}
			.bottom img{
				width: 400px;
				height:90px;
				margin-top: 100px;
			}
			.bottom a{
				width: 100%;
				min-height: 50px;
				line-height: 50px;
				text-align: center;
				color: white;
				display: block;
			}
			/*默认*/
			.body{
				width: 100%;
				height: 1870px;
			} 
			.top{
				width: 100%;
				height: 800px;
				background-color: white;
			}
			.top h1{
				width: 1200px;
				height: 50px;
				margin: auto;
				text-align: center;
				line-height: 50px;
				font-size: 50px;
				position: relative;
				top: 70px;
			}
			.top hr{
				width: 250px;
				height: 2px;
				margin: auto;
				margin-top: 20px;
				background-color: #87CEEB;
				position: relative;
				top: 75px;
			}
			.top-b{
				width: 1200px;
				height: 500px;
				margin: auto;
				margin-top: 50px;
				border: 1px solid;
				position: relative;
				top: 90px;
			}
			.top-b h1{
				width: 1200px;
				height: 100px;
				font-size: 60px;
				text-align: center;
				line-height: 100px;
			}
			.top-b h1:hover{
				color: orange;
			}
			.top-b h2{
				width: 1200px;
				height: 100px;
				font-size: 30px;
				text-align: left;
				text-indent: 60px;
				line-height: 40px;
				margin-top: 100px;
			}
			.top-b h2:hover{
				color: #398439;
			}
			
			.center{
				widows: 100%;
				height: 400px;
				/*background-color:green;*/
			}
			.center h1{
				width: 100%;
				height: 200px;
				font-size: 70px;
				color: #FFFFFF;
				line-height: 200px;
				text-align: center;
			}
			.center h2{
				width: 100%;
				height: 100px;
				font-size: 40px;
				line-height: 100px;
				text-align: center;
				color: #FFFFFF;
			}
			.bot{
				width: 100%;
				height: 750px;
				background-color: white;
				border: 1px white solid;
			}
			.bot h3{
				width: 1200px;
				height:70px;
				margin: auto;
				margin-top: 70px;
				font-size: 50px;
				text-align: center;
				display: block;
			}
			.bot hr{
				height: 2px;
				margin: auto;
				width: 220px;
				margin-bottom: 30px;
				background-color: blue;
			}
			
			.bot-c{
				width: 1200px;
				height: 500px;
				/*border: 1px solid;*/
				margin: auto;
			}
			.women{
				width:350px;
				height: 460px;
				float: left;
				/*border: 1px solid;*/
				margin: 20px;
				position: relative;
				overflow: hidden;
			}
			.women img{
				width: 100%;
				height: 100%;
			}
			.women div{
				height: 70px;
				width: 350px;
				background-color:rgba(135,206,235,.7);
				position: absolute;
				top: -70px;
			}
			.women:hover div{
				position: absolute;
				top: 380px;
				transition: all 2s;
			}
			.women div h1{
				width: 350px;
				height: 70px;
				text-align: center;
				line-height: 70px;
				color: rgba(62,75,83,);
			}
		</style>
	</head>
	<!--
    	作者：王风宝
    	时间：2019-11-22
    	描述：关于商城
    -->
	<body>
		<div class="heard"><!--顶部导航-->
		<a href="#DINGBU" class="arrow"></a>
				<div class="heard-top">
					<div>
						<img src="img/logo.png" /><a name="DINGBU">
						<ul>
							<li><a href="购物车（2）.html">购物车</a></li>
							<li><a href="登录（2）.html">登录</a></li>
							<li><a href="注册（2）.html">注册</a></li>
							<li><a href="关于（2）.html">关于</a></li>
						</ul></a>
					</div>
				</div><!--顶部黑色-->
				<div class="heard-cen">
					<div>
						<h1>SUPER MARKET</h1>
						<input type="text" />
						<span></span>
					</div>
				</div>
				<div class="heard-bot">
					<div class="h-b-d">
						<ul>
							<li class="index"><a href="index.html">首页</a></li>
							<li class="one">
								<p>水果</p>
								<div class="two">
									<ol>
										<li><a href="水果(2).html">春季水果</a></li>
										<li><a href="水果(2).html">夏季水果</a></li>
										<li><a href="水果(2).html">冬季水果</a></li>
										<li><a href="水果(2).html">秋季水果</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<p>蔬菜</p>
								<div class="two">
									<ol>
										<li><a href="蔬菜.html">青菜</a></li>
										<li><a href="蔬菜.html">干菜</a></li>
										<li><a href="蔬菜.html">肉类</a></li>
										<li><a href="蔬菜.html">海鲜</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<p>零食</p>
								<div class="two">
									<ol>
										<li><a href="零食（2）.html">坚果</a></li>
										<li><a href="零食（2）.html">辣条</a></li>
										<li><a href="零食（2）.html">饼干</a></li>
										<li><a href="零食（2）.html">干果</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<p>生活用品</p>
								<div class="two">
									<ol>
										<li><a href="生活用品（2）.html">餐具</a></li>
										<li><a href="生活用品（2）.html">家具</a></li>
										<li><a href="生活用品（2）.html">卫浴</a></li>
										<li><a href="生活用品（2）.html">服饰</a></li>
									</ol>
								</div>
							</li>
							<li class="one">
								<a href="每日推荐2.html">每日特价</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<!--顶部导航结束-->
			<div class="body">
				<div class="top">
					<h1>关于我们</h1>
					<hr />
					<div class="top-b">
						<h1>创意来源</h1>
						<h2>
							网购是目前人们购物的常态，
							品牌有品牌的独立官网商城。
							还有京东、淘宝这种大杂烩类
							型的购物网站。然而与人们日
							常相关的超市却没有一个购物
							平台。水果蔬菜这种每天不可
							缺少的东西，都需要跑来跑去
							的购买。我们这个购物平台的
							初衷就是更方便人们每天的购
							物。通过与小区的便利店或者
							超市合作让人们可以足不出户
							就可以购买生活中的必需品。
						</h2>
					</div>
				</div><!--上边-->
				<div class="center">
					<h1>19计算机-智平1班</h1>
					<h2>王风宝 任寒波 李成</h2>
				</div>
				<div class="bot">
					<h3>我的团队</h3>
					<hr />
					<div class="bot-c">
						<div class="women">
							<img src="img/关于（2）/我们/timg.jpeg" />
							<div>
								<h1>王风宝</h1>
							</div>
						</div>
						<div class="women">
							<img src="img/关于（2）/我们/timg-1.jpeg" />
							<div>
								<h1>任寒波</h1>
							</div>
						</div>
						<div class="women">
							<img src="img/关于（2）/我们/1574782707245.jpg" />
							<div>
								<h1>李成</h1>
							</div>
						</div>
					</div>
				</div>
			</div><!--身体-->
			
			
			
			
			
		<div class="bottom">
			<img src="img/logo2.png" />
			<a href="#DINGBU">返回顶部</a>
		</div>
	</body>
</html>
